import React, { useContext, useRef } from 'react';
import ReactDOM from 'react-dom';
/* 
  函数式组件  let qq = useRef()   ref={qq}  qq.current
*/
let MyContext = React.createContext();

class Child extends React.Component {
  static contextType = MyContext
  render() {
    console.log(this.context)
    return <><h3>child</h3></>
  }
}
function Child2() {
  let context = useContext(MyContext)
  console.log(context)
  return <><h3>child2</h3></>
}


function App() {
  let qq = useRef();
  function fn() {
    console.log(qq.current)
  }
  return <MyContext.Provider value={{ qqq: 123 }}>
    <h1 ref={qq}>hello</h1>
    <Child ref={qq} />
    <Child2 />
    <button onClick={fn}>按钮</button>
  </MyContext.Provider>
}

ReactDOM.render(<App />, document.getElementById('root'))